<script setup>

import Navigation from "@/components/Navigation.vue";
</script>

<template>
  <div class="background-banner"/>
  <div class="background-banner-cover"/>
  <el-container>
    <el-header style="padding: 0">
      <navigation/>
    </el-header>
    <el-main>

    </el-main>
    <el-footer>

    </el-footer>
  </el-container>
</template>

<style scoped>
.background-banner{
  position: absolute;
  z-index: -2;
  background: linear-gradient(130deg, rgb(36, 186, 220), rgb(51, 146, 255) 41.07%, rgb(0, 34, 255) 76.05%);
  float: left;
  width: 100%;
  height: 600px;

}
.background-banner-cover{
  position: absolute;
  z-index: -1;
  top:300px;
  height: 300px;
  width: 100%;
  background: linear-gradient(180deg,
  hsla(225, 40%, 96%, 0) 0,
  hsla(225, 40%, 96%, .013) 8.1%,
  hsla(225, 40%, 96%, .049) 15.5%,
  hsla(225, 40%, 96%, .104) 22.5%,
  hsla(225, 40%, 96%, .175) 29%,
  hsla(225, 40%, 96%, .259) 35.3%,
  hsla(225, 40%, 96%, .352) 41.2%,
  hsla(225, 40%, 96%, .45) 47.1%,
  hsla(225, 40%, 96%, .55) 52.9%,
  hsla(225, 40%, 96%, .648) 58.8%,
  hsla(225, 40%, 96%, .741) 64.7%,
  hsla(225, 40%, 96%, .825) 71%,
  hsla(225, 40%, 96%, .896) 77.5%,
  hsla(225, 40%, 96%, .951) 84.5%,
  hsla(225, 40%, 96%, .987) 91.9%,
  white);
}
</style>